import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', {
    /*
    * 为什么是这个顺序呢？
    * 因为 state 相当于 data，getters 相当于 computed，actions 相当于 methods
    * 它们的写法还都是一样的
    *
    * persist 目的:
    * 使得应用在重新加载时，状态数据依然可以被使用
    *
    * https://pinia.vuejs.org/zh/
    * https://blog.csdn.net/u012533474/article/details/129263196
    * https://blog.csdn.net/u012533474/article/details/130455888
    * https://www.cnblogs.com/zxl327/p/17911621.html
    * */
    state() {
        return {
            name: 'jack'
        }
    },
    getters: {
        double(state) {
            return state.name + '~' + state.name
        }
    },
    actions: {
        M_name() {
            this.name = 'jackson'
        }
    },
    persist: {
        enabled: true, // 开启存储
        detached: true, // 设置订阅与组件分离
        strategies: [ // 这里默认它不会去存，只有修改过之后才会
            { storage: sessionStorage, paths: ['name'] },
            { storage: localStorage, paths: ['name'] }
        ]
    }
})
